<extend file="resource/view/master.php"/>
<block name="content">
    <ol class="breadcrumb" style="background-color: #f9f9f9;padding:8px 0;margin-bottom:10px;">
        <li>
            <a href="{{u('index')}}"><i class="fa fa-cogs"></i>
                文章管理</a>
        </li>
        <li class="active">
            <a href="">文章添加</a>
        </li>
    </ol>
    <ul class="nav nav-tabs" role="tablist">
        <li><a href="{{u('index')}}">文章管理</a></li>
        <li class="active"><a href="">文章添加</a></li>
    </ul>
    <form class="form-horizontal" id="form" onsubmit="return store(this)" action="" method="post">
        <div class="panel panel-default">
            <div class="panel-heading">
                <h3 class="panel-title">文章管理</h3>
            </div>
            <div class="panel-body">
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">文章标题</label>
                    <div class="col-sm-9">
                        <input type="text" name="title"  class="form-control" placeholder="文章标题">
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">文章作者</label>
                    <div class="col-sm-9">
                        <input type="text" name="author"  class="form-control" placeholder="文章作者">
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">所属分类</label>
                    <div class="col-sm-9">
                        <select class="js-example-basic-single form-control" name="category_cid">
                            <option value="0">请选择分类</option>
                            <foreach from="$cateData" key="$k" value="$v">
                                <option value="{{$v['cid']}}">{{$v['_cname']}}</option>
                            </foreach>
                        </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">标签</label>
                    <div class="col-sm-9">
                        <foreach from="$tagData" key="$k" value="$v">
                            <label class="checkbox-inline">
                                <input type="checkbox" name="tag[]" value="{{$v['tid']}}"> {{$v['tname']}}
                            </label>
                        </foreach>
                    </div>
                </div>
<!--                uploadify插件-->
                <script SRC="resource/uploadify/jquery.uploadify.min.js"></script>
                <link rel="stylesheet" href="resource/uploadify/uploadify.css">
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">缩略图</label>
                        <div class="col-sm-9">
                            <div class="input-group">
                                <div class="input-group-btn">
                                    <input type="file" name="file_upload" id="file_upload" />
                                    <style>
                                        #upload li{
                                            float: left;
                                            list-style: none;
                                            margin-right: 5px;
                                        }
                                        .delImg{
                                            color: black;
                                            font-size: 14px;
                                        }
                                    </style>
                                    <div id="upload">
                                    </div>
                                </div>
                            </div>

                            <span class="help-block">建议大小(宽100高100)</span>
                        </div>
<!--                    <div class="col-sm-9">-->
<!--                        <div class="input-group">-->
<!--                            <div class="input-group-btn">-->
<!--                                <input type="file" class="btn btn-default" name="">-->
<!--                            </div>-->
<!--                        </div>-->
<!---->
<!--                        <span class="help-block">建议大小(宽100高100)</span>-->
<!--                    </div>-->
                </div>
                <script>
                    $(function() {
                        $("#file_upload").uploadify({
                            "height"        : 30,
                            "swf"           : 'resource/uploadify/uploadify.swf',
                            "uploader"      : "{{u('upload')}}",
                            "width"         : 120,
                            'buttonText' : '请选择文件...',
                            'removeTimeout' : 0.1,
                            'onUploadSuccess' : function(file, data, response) {
                                //console.log(data);
                                //alert(data)
                                str = '<li>';
                                str += '<img width="60px" src="'+data+'" alt="">';
                                str += '<a href="javascript:;" class="delImg" path="'+data+'">X</a>';
                                str+='<input class="path" type="hidden" name="thumb" value="'+data+'">';
                                str += '</li>';
                                $('#upload').append(str);
                            }
                        });
                    });
                </script>
                <script>
                    //删除
                    $('#upload').on('click','.delImg',function(){
                        var path = $(this).attr('path');
                        var _this = $(this);
                        //alert(path);
                        //请求地址、请求参数、成功返回、数据类型
                        $.post("{{u('delImg')}}",{path:path},function(res){
                            // alert(1);
                            _this.parent('li').remove();
                        },'json')
                    })
                </script>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">文章摘要</label>
                    <div class="col-sm-9">
                        <textarea type="text" name="digest"  class="form-control" placeholder="文章摘要"></textarea>
                    </div>
                </div>

                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">关键字</label>
                    <div class="col-sm-9">
                        <textarea type="text" name="keywords"  class="form-control" placeholder="文章摘要"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">文章描述</label>
                    <div class="col-sm-9">
                        <textarea type="text" name="des"  class="form-control" placeholder="文章摘要"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label for="" class="col-sm-2 control-label">文章内容</label>
                    <div class="col-sm-9">
                        <textarea name="content" id="container" style="height:300px;width:100%;"></textarea>
                        <script>
                            util.ueditor('container', {hash:2,data:'hd'}, function (editor) {
                                //这是回调函数 editor是百度编辑器实例
                            });
                        </script>
                    </div>
                </div>
                <!--百度编辑器引入-->
<!--                <script type="text/javascript" charset="utf-8" src="./ueditor1_4_3/ueditor.config.js"></script>-->
<!--                <script type="text/javascript" charset="utf-8" src="./ueditor1_4_3/ueditor.all.min.js"> </script>-->
<!--                <script type="text/javascript" charset="utf-8" src="./ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>-->
<!--                <div class="form-group">-->
<!--                    <label for=""  class="col-sm-2 control-label">文章内容</label>-->
<!--                    <div class="col-sm-9">-->
<!--                        <script id="ed1" type="text/plain" style="width:100%;height:300px;" name="content"></script>-->
<!--                        <script>-->
<!--                            var ue = UE.getEditor('ed1');-->
<!--                        </script>-->
<!--                    </div>-->
<!--                </div>-->
            </div>
        </div>
        <button class="btn btn-primary" type="submit">确定</button>
    </form>

</div>
</block>
<script>
    function store(obj)
    {
        //序列化获取表单数据
        var data=$(obj).serialize();
        $.post("{{u('store')}}",data,function(res){
            //res:{valid:1,message:'响应信息'}
            if(res.valid){
                //成功
                //提示框在hdjs手册中搜索消息框
                util.message(res.message,"{{u('index')}}",'success');
            }else{
                //失败
                util.message(res.message,"back",'error');
            }
        },'json')
        //组织表单提交
        return false;
    }
</script>